<template>
	
	
	<view class="bgIndex">
		<sunui-navbar :items="tabLists" lineHeight="70rpx" :isCenter="true" :currentIndex="currentIndexs" padding="12rpx"
			activeColor="#007BFF" :size="300" activeLineBg="#007BFF" textAlign="center" activeLineWidth="50rpx"
			activeDirection="center" activeLineHeight="5rpx" bgColor="#fff" :margin="20"
			@change="getChanges"></sunui-navbar>
		<sunui-navbar v-if="currentIndexs==0" :items="tabList" lineHeight="70rpx" :isCenter="true" :currentIndex="currentIndex" padding="12rpx"
			activeColor="#007BFF" :size="100" activeLineBg="#007BFF" textAlign="center" activeLineWidth="100%"
			activeDirection="space-between" activeLineHeight="5rpx" bgColor="#fff" :margin="20"
			@change="e=>getChange(e,tabList[e].id)"></sunui-navbar>
		<view class="padding20">


			<view class="search-content margin-bottom_40rpx">

				<image class="search-img" :src="search" mode=""></image>
				<input placeholder="请搜索用户名字" v-model="searchVal" @input="changeInput" @confirm="changeSearch"
					style="width: auto;line-height: 1em; " placeholder-style="font-size:28rpx;color:#A1A1A1;" />

			</view>
			<block v-if="currentIndexs==0">
				<mescroll-body ref="mescrollRef" :height="windowHeight+'rpx'" @init="mescrollInit" @down="downCallback"
					@up="upCallback" :up="upOption" :down="downOption">
					<view v-for="(item,index) in list" :key="index" class="mobileTransactionRecords">
						<!-- <l-swipeAction :options="options" @clickItem="clickItem($event, item.id)"> -->
							<view class="flex-between "
								>
					
								<view class="flex-start-center">
									<image class="avatar" :src="item.avatar"
										mode=""></image>
									<!-- <image class="avatar" src="../../static/第一行所有图标/矩形 141.png" mode=""></image> -->
									<view class="margin-left_20rpx">
					
										<view class="flex-start-center">
											<view class="font-weight font-overflow" style="max-width: 230rpx;">
												{{item.nickname}}
											</view>
											<view class="flex-start-center margin-left_10rpx">
					
												<view class="male flex"
													v-if="(item.sex)==1">
													<image class="maleImg" :src="path25" mode="widthFix"></image>
													<text>{{item.age}}</text>
												</view>
												<view class="female flex" v-else>
													<image class="femaleImg" :src="path69" mode="widthFix"></image>
													<text>{{item.age}}</text>
												</view>
											</view>
										</view>
										<view class="font-overflow " style="max-width: 350rpx; margin-top: 14rpx;">
											<text
												style="margin-right: 10rpx;color: #666666;" >创建时间：{{item.create_time}}</text>
					
										</view>
					
									</view>
								</view>
					
								<view class="flex-column-end">
									<view style="" class="margin-bottom_10rpx flex-start-center">
					
										<text style="font-size: 32rpx;color: #007BFF;margin-right: 10rpx;">{{item.price}}</text>
										<text style="font-size: 24rpx;color: #007BFF;">{{currency_name}}</text>
									</view>
								
								</view>
					
							</view>
							<view class="orderStatus flex">
								<text>{{orderStatusFn(item.is_agree)}}</text>
							</view>
						<!-- </l-swipeAction> -->
					</view>
				</mescroll-body>
			</block>
			<block v-else>
				<mescroll-body ref="mescrollRef" :height="windowHeight+'rpx'" @init="mescrollInit" @down="downCallback"
					@up="upCallback" :up="upOption" :down="downOption">
					<view class="messagesList " v-for="(item,index)  in list " :key="index">
				
						<view class="flex-between">
							<view class="flex-start-center">
								<image class="avatar" :src="item.avatar" mode=""></image>
								<view class="margin-left_20rpx">
									<view class="flex-start-center">
										<view class="font-weight font-overflow"
											style="max-width: 180rpx; margin-right: 10rpx;">
											{{item.nickname}}
										</view>
										<view class="flex-start-center">
				
											<view class="male flex" v-if="item.sex==1">
												<image v-if="item.sex==1" class="maleImg" :src="path25" mode="widthFix"></image>
												<image v-if="item.sex==2" class="femaleImg" :src="path69" mode="aspectFit">
												</image>
												<text>{{item.age}}</text>
				
											</view>
											<view class="female flex" v-if="item.sex==2">
												<image v-if="item.sex==1" class="maleImg" :src="path25" mode="widthFix"></image>
												<image v-if="item.sex==2" class="femaleImg" :src="path69" mode="aspectFit">
												</image>
												<text>{{item.age}}</text>
				
											</view>
											
				
										</view>
									</view>
				
									<view class="flex-start-center margin-top_10rpx">
										<text style="margin-right: 20rpx;">发来手机号申请</text>
									<!-- 	<view class="homepage flex" @click="ViewHomepageFn(item.id)">
											<text style="margin-bottom: 5rpx;">查看主页</text>
				
										</view> -->
									</view>
				
				
								</view>
							</view>
							<view class="">
								<view class="flex" v-if="item.is_agree==1">
									<view class="edit flex margin-left_10rpx" @click="editFn(item)" >
												
										<text>同意</text>
									</view>
									<view class="delete flex margin-left_10rpx" @click="deleteFn(item)">
												
										<text>拒绝</text>
									</view>
								</view>
								<view class="flex" >
									<view v-if="item.is_agree==2" class="edit-gay flex margin-left_10rpx" >
								
										<text>已同意</text>
									</view>
									<view v-if="item.is_agree==3" class="edit-gay flex margin-left_10rpx">
								
										<text>已拒绝</text>
									</view>
								</view>
							</view>
				
				
				
						</view>
				
				
					</view>
				</mescroll-body>
			</block>
			<sunui-popup ref="myPackagePopup">
				<template v-slot:content>
					<block v-if="join_dataList.length">
						<view class="" v-for="(item,index) in join_dataList" :key="index">
							<view class="flex-between padding20 border-bottom-ECECEC">
								<view class="flex-start-center">
									<image class="img" :src="item.avatar" mode=""></image>
									<view class="margin-left_10rpx">
										<view class="font-weight">
											{{item.nickname}}
										</view>
										<view class="flex">
											<text style="margin-right: 10rpx;">加入时间：{{item.create_time}}</text>

										</view>
									</view>
								</view>
								<view style="color: #8B8B8B;" class="flex-start-center">
									<view class="">
										{{participationFn(item.status)}}
									</view>
									<view v-if="isHost" class="" @click="whoCanSeeIt(item.id)">
										<image class="threePoints" :src="threspoints" mode=""></image>
									</view>
								</view>
							</view>

						</view>

					</block>


				</template>
			</sunui-popup>
			<!-- 	 <view class="buildList">
			 	<view class="font-weight margin-bottom_20rpx" style="color: #666666;">
			 		<text>搭子号：dazizi252141541447</text>
			 	</view>
			 	<view class="flex-end-top ">
			 		<view class="orderLocation">
			 			<image class="orderImg" src="https://n8.weijuyunke.com/2024-06-07/f8292202406071854496600.png"
			 				mode=""></image>
			 			<view class="orderStatusImged flex">
			 				<text>已结束</text>
			 			</view>
			 		</view>
			 		<view class="margin-left_16rpx flex-columns" style="width:454rpx;height: 200rpx;">
			 			<view class="font-overflow2 font-weight" style="width:100%">
			 				端午节去长沙寻找组队搭子
			 
			 
			 			</view>
			 			<view class=" font-overflow flex-between">
			 
			 				<view class="flex-start-center">
			 					<image class="tagImg" src="../../static/第一行所有图标/组合 789.png" mode="aspectFit"></image>
			 
			 					<view class="tagTitlePink flex">
			 						本地优先
			 					</view>
			 					<view class="tagTitleOrange  flex">
			 						情绪价值
			 					</view>
			 				</view>
			 			
			 
			 
			 			</view>
			 
			 
			 			<view class="flex-between">
			 				<view class="flex-start-center">
			 					<image class="avaterImg" src="../../static/第一行所有图标/椭圆 4.png" mode=""></image>
			 					<text style="color: #9D9D9D;">123木子</text>
			 				</view>
			 				<view class="flex-start-center">
			 					<view class="">
			 						<view class="flex-between v-p-share">
			 							<view class="v-m-width not-font-overflow flex1">
			 								<block v-for="(item, index) in detailInfo" :key="index">
			 									<image v-if="index<5" class="pt_img" :src="item.avatar"></image>
			 								</block>
			 
			 							</view>
			 
			 						</view>
			 					</view>
			 					<view class="" style="color: #9D9D9D;">
			 						<text>120参与</text>
			 					</view>
			 				</view>
			 			</view>
			 
			 
			 		</view>
			 
			 	</view>
			 	<view style="margin-top: 15rpx;width: 100%;" class="flex-between">
			 		<view class="">
			 			<text>发布时间：2024.10.32 15:32</text>
			 		</view>
			 
			 	</view>
			 	<view class=" flex-end margin-top_20rpx" style="width: 100%;">
			 
			 		<view class="contactHost flex margin-right_16rpx">
			 			<image class="chatImg" src="../../static/用户中心图标/path5.png" mode=""></image>
			 			<text>联系搭主</text>
			 		</view>
			 		<view class="exitActivity flex margin-right_16rpx">
			 
			 			<text>退出该活动</text>
			 		</view>
			 		<view class="viewDetails flex ">
			 
			 			<text>查看详情</text>
			 		</view>
			 	</view>
			 
			 </view> -->




			<!-- <view class="height50">

			</view> -->
			<!-- 	<view class="PublishTag flex">
				发布搭子
			</view> -->
		</view>

	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				currency_name:uni.getStorageSync("system").currency_name,
				path5:this.$img.path5,
				threspoints:this.$img.threspoints,
				search:this.$img.search,
				userInfo: uni.getStorageSync("userInfo"),
				downOption: {
					auto: false
				},
				currentIndexs:0,
				// 上拉配置项
				upOption: {
					auto: true
				},
				currentIndex: 0,
				windowHeight: 0,
				status:0,
				list: [],
				searchVal:'',
				path25: this.$img.path25,
				path69: this.$img.path69,
				join_dataList: [],
				tabList: [{
					name: '全部',
					id: '0' //null
				}, {
					name: '申请中',
					id: '1' //null
				}, {
					name: '同意',
					id: '2' //null
				}, {
					name: '驳回',
					id: '3' //null
				},],
				tabLists: [{
					name: '我申请联系了谁',
					id: '' //null
				}, {
					name: '谁申请联系了我',
					id: '1' //null
				}, ],
				detailInfo: [],


			}
		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => {
					this.windowHeight = res.windowHeight * 2 - 800;
				}
			});
		},

		onShow() {
			this.$nextTick(() => {
				this.mescroll?.resetUpScroll();
			})
		},
		computed: {

			// 订单状态 '1 待审核 2 上架中 3 下架 4 驳回',
			orderStatusFn: function() {
				return function(status) {

					let orderStatus = '';
					// status订单状态（0.待付款 1.待接单 2.已接单 3.服务中 4.已完成 5.已取消/退款)
					orderStatus =
						status == 0 ? '-' : status == 1 ? '申请中' :  status == 2?'同意':'驳回';

					return orderStatus;
				};
			},
			join_dataFn() {
				return function(arr) {
					return arr.filter(item => item.status == 1)
				}
			},

			isHostFn() {

				return function(id, uid) {
					if (id == uid) {
						return true
					} else {
						return false
					}
				}

			},
			participationFn: function() {
				return function(status) {

					let orderStatus = '';
					// status订单状态（0.待付款 1.待接单 2.已接单 3.服务中 4.已完成 5.已取消/退款)
				orderStatus =
					status == 0 ? '全部' : status == 1 ? '已加入' : status == 2 ? '用户被踢出活动' : status == 3 ?
					'用户自己退出活动' : status == 4 ? '过期解散' : "完成";

					return orderStatus;
				};
			},
			deadlineRegistrationFn() {
			
				return function(time,status) {
					console.log(Math.floor(Date.now() / 1000),time,status)
					if(Math.floor(Date.now() / 1000)>time){
						return false
					}else{
						return true
					}
				}
			
			},
		},
		methods: {
			getChanges(index) {
				console.log(index)
			
				this.currentIndexs = index
			
				this.$nextTick(() => {
					this.mescroll?.resetUpScroll();
				})
			
			
			},
			changeInput(e) {
				console.log(e)
				this.searchVal = e.detail.value
				this.mescroll?.resetUpScroll();
			},
			privateChat(id) {
				// //停止心跳检测
				// this.socket.stopHeartbeat()
				// //退出页面关闭websocket
				// this.socket.close({
				// 	success(res) {
			
				// 		console.log("关闭成功", res)
				// 	},
				// 	fail(err) {
				// 		console.log("关闭失败", err)
				// 	}
				// })
				setTimeout(() => {
					this.$sun.navGo('/pagesB/index/HM-chat/HM-chat', {
						uid: id
					})
				})
			},
			participationRecord(join_data) {
				this.join_dataList = join_data
				this.$refs.myPackagePopup.show({
					anim: 'bottom',
					position: 'bottom',
					style: 'background-color:#fff;width:800rpx;border-radius:10rpx;padding:20rpx;',
					bottomClose: false,
					shadeClose: true,
					topclose: true,
					clostPx: true
				});
			},

			editFn(item) {
				// 掉接口
				uni.showModal({
					title: '提示',
					content: '是否同意'+item.nickname+'获取手机号',
					success: async (res) => {
						if (res.confirm) {

							const result = await this.$http.post({
								url: this.$api.agreeCheck,
								data: {

									id: item.id,
									is_agree:2


								},
								headers: {
									'Authorization': this.userInfo.token
								}

							})
							if (result.code == 0) {

								this.$sun.toast(result.message, 'none')

								setTimeout(() => {
									this.mescroll?.resetUpScroll();
								}, 500)

							} else {

								this.$sun.toast(result.message, 'none')
							}
						} else if (res.cancel) {

						}
					}
				});
			},
			deleteFn(item) {
				// 掉接口
				uni.showModal({
					title: '提示',
					content: '是否拒绝'+item.nickname+'获取手机号',
					success: async (res) => {
						if (res.confirm) {
			
							const result = await this.$http.post({
								url: this.$api.agreeCheck,
								data: {
			
									id: item.id,
									is_agree:3
			
			
								},
								headers: {
									'Authorization': this.userInfo.token
								}
			
							})
							if (result.code == 0) {
			
								this.$sun.toast(result.message, 'none')
			
								setTimeout(() => {
									this.mescroll?.resetUpScroll();
								}, 500)
			
							} else {
			
								this.$sun.toast(result.message, 'none')
							}
						} else if (res.cancel) {
			
						}
					}
				});
			},
			getChange(index,id) {
				console.log(index,id)
				this.status = id
				this.currentIndex = index
				this.$nextTick(() => {
					this.mescroll?.resetUpScroll();
				})
			
			},
			goDeatilFn(id) {
				console.log(id)
				this.$sun.navGo('/pagesB/index/buildSubDetail', {
					id: id
				})
			},
			async upCallback(scroll) {

				if(this.currentIndexs==0){
					const result = await this.$http.post({
						url: this.$api.meCheckUser,
						data: {
							page: scroll.num,
							limit: 10,
							is_agree:this.status,
							nickname:this.searchVal,
							is_oneself_uid: this.userInfo.id,
							
					
					
					
						},
						headers: {
							'Authorization': this.userInfo.token
						}
					
					})
					
					
					if (result.code == 0) {
					
						this.mescroll.endByPage(result.data.list.length, this.$sun.pagingSum(result.data.count, 10));
						if (scroll.num == 1) this.list = [];
					
						this.list = this.list.concat(result.data.list);
					
						this.list.forEach((item) => {
							// item.expire_timeObject = this.formatTimeDifference(item.expire_time)
							item.labelList = item.label.split(",")
						})
					
					
					
						console.log('this.list', this.list, this.list.length);
					} else {
						this.$sun.toast(result.message, 'none')
					}
				}else{
					const result = await this.$http.post({
						url: this.$api.checkMeUser,
						data: {
							page: scroll.num,
							limit: 10,
							nickname: this.searchVal
					
					
					
					
						},
						headers: {
							'Authorization': this.userInfo.token
						}
					
					})
					
					
					if (result.code == 0) {
					
						this.mescroll.endByPage(result.data.list.length, this.$sun.pagingSum(result.data.count, 10));
						if (scroll.num == 1) this.list = [];
					
						this.list = this.list.concat(result.data.list);
					
						// 		this.list.forEach((item) => {
					
						// 			item.labelList = item.label.split(",")
						// 		})
					
					
					
						console.log('this.list', this.list, this.list.length);
					} else {
						this.$sun.toast(result.message, 'none')
					}
				}


			},
		}
	}
</script>

<style lang="less" scoped>
	.img {
		width: 84rpx;
		height: 84rpx;
	}
	
	.threePoints {
		width: 32rpx;
		height: 32rpx;
	}
	.bgIndex {
		.mobileTransactionRecords{
			padding: 40rpx 20rpx;
			background-color: #fff;
			 .orderStatus {
			 	position: absolute;
			 	right: 0;
			 	top: 0;
			 	width: 106rpx;
			 	height: 48rpx;
			 	border-radius: 0rpx 20rpx 0rpx 20rpx;
			 	color: #fff;
			 	background: #007BFF;
			 }
			.avatar {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
			}
			
			.female {
				width: 90rpx;
				height: 36rpx;
				border-radius: 20rpx;
				color: #fff;
				background: #FA5799;
			
				.femaleImg {
					width: 18rpx;
					
					margin-right: 10rpx;
				}
			}
			
			.male {
				width: 90rpx;
				height: 36rpx;
				border-radius: 20rpx;
				color: #fff;
				background: rgb(1, 145, 255);
			
				.maleImg {
					width: 18rpx;
					margin-right: 10rpx;
				}
			}
		}
		

		.search-content {

			// justify-content: center;
			display: flex;
			align-items: center;
			// margin: 20rpx;
			height: 76rpx;

			background: rgb(255, 255, 255);
			border-radius: 84rpx;


			.search-img {
				width: 30rpx;
				height: 30rpx;
				margin-right: 20rpx;
				margin-left: 20rpx;
			}

			.address-img {
				width: 30rpx;
				height: 30rpx;
				margin-right: 10rpx;
				margin-left: 20rpx;
			}

			.icon_close {
				padding: 0rpx 15rpx;
				width: 36rpx;
				height: 36rpx;
				margin-right: 30rpx;
			}

		}
		.messagesList {
			background-color: #fff;
			padding: 20rpx;
			.edit {
				border-radius: 8rpx;
				width: 112rpx;
				color: #fff;
				height: 48rpx;
				background: rgb(1, 145, 255);
				;
			}
			.edit-gay{
				border-radius: 8rpx;
				width: 112rpx;
				color: #fff;
				height: 48rpx;
				background: rgb(225, 225, 225);
				color: #FFFFFF;
				
			}
			
			
			.delete {
				border-radius: 8rpx;
				width: 112rpx;
				color: #fff;
				height: 48rpx;
				background: rgb(255, 0, 0);
			}
			
			.homepage {
				width: 124rpx;
				height: 44rpx;
				box-sizing: border-box;
				border: 2rpx solid rgb(120, 93, 246);
				border-radius: 76px;
				color: rgb(120, 93, 246);
				background: rgb(255, 255, 255);
			}
		
			.avatar {
				width: 102rpx;
				height: 104rpx;
				border-radius: 50%;
			}
		
			.female {
				width: 90rpx;
				height: 36rpx;
				border-radius: 20rpx;
				color: #fff;
				background: #FA5799;
		
				.femaleImg {
					width: 18rpx;
		
					margin-right: 10rpx;
				}
			}
		
		
		
			.male {
				width: 90rpx;
				height: 36rpx;
				border-radius: 20rpx;
				color: #fff;
				background: rgb(1, 145, 255);
		
				.femaleImg {
					margin-top: 5rpx;
					width: 20.96rpx !important;
					height: 20.96rpx !important;
					margin-right: 15rpx;
				}
		
				.maleImg {
					width: 18rpx;
					margin-right: 10rpx;
				}
			}
		
			.vip {
				width: 96rpx;
				height: 36rpx;
				border-radius: 20rpx;
				color: #fff;
				margin-left: 15rpx;
		
				background: linear-gradient(90.00deg, rgb(145, 91, 227) 0%, rgb(189, 108, 223) 100%);
		
				.vipImg {
					width: 24.96rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
					margin-top: 8rpx;
				}
			}
		
			.news {
				width: 55rpx;
				height: 55rpx;
				background-color: red;
				border-radius: 50%;
				color: #fff;
			}
		
		}

		.buildList {
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			padding: 20rpx;
			background: rgb(255, 255, 255);
			margin-top: 20rpx;
			border-radius: 20rpx;

			.contactHost {
				width: 158rpx;
				height: 52rpx;
				color: #785DF6;
				box-sizing: border-box;
				border: 2rpx solid rgb(120, 93, 246);
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.exitActivity {
				width: 158rpx;
				height: 52rpx;
				color: red;
				box-sizing: border-box;
				border: 2rpx solid red;
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.viewDetails {
				width: 158rpx;
				height: 52rpx;
				color: rgb(51, 51, 51);
				box-sizing: border-box;
				border: 2rpx solid rgb(240, 240, 240);
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.orderStatus {
				position: absolute;
				right: 0;
				top: 0;
				width: 106rpx;
				height: 48rpx;
				border-radius: 0rpx 20rpx 0rpx 20rpx;
				color: #fff;
				background: rgb(120, 93, 246);
			}

			.orderLocation {
				position: relative;

				.orderStatusImg {
					position: absolute;
					left: 0;
					top: 0;
					width: 106rpx;
					height: 48rpx;
					border-radius: 16rpx 0rpx 16rpx 0rpx;
					color: #fff;
					background: rgb(224, 32, 32);
					z-index: 80;
				}

				.orderStatusImged {
					position: absolute;
					left: 0;
					top: 0;
					width: 106rpx;
					height: 48rpx;
					border-radius: 16rpx 0rpx 16rpx 0rpx;
					color: #fff;
					border-radius: 16rpx 0rpx 16rpx 0rpx;

					background: rgb(0, 0, 0);
					z-index: 999;
				}
			}

			.orderStatused {
				position: absolute;
				right: 0;
				top: 0;
				width: 106rpx;
				height: 48rpx;
				border-radius: 0rpx 20rpx 0rpx 20rpx;
				color: #999999;
				background: rgb(236, 235, 235);
			}

			.tagImg {
				width: 118rpx;
				height: 38rpx;
			}

			.addImg {
				width: 30.02rpx;
				height: 30.02rpx;
			}

			.tagTitle {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: rgb(0, 198, 141);
				background: rgb(212, 255, 249);
				margin-right: 5rpx;
			}

			.avaterImg {
				width: 40rpx;
				height: 40rpx;
				border-radius: 50%;
				margin-right: 8rpx;
			}

			.tagTitleGay {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: #666666;
				background: #F5F5F5;
				margin-right: 5rpx;
			}

			.tagTitleOrange {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: rgb(238, 100, 41);
				background: rgba(238, 100, 41, 0.13);
				;
				margin-right: 5rpx;
			}

			.tagTitlePink {
				width: 116rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: #F95CEF;
				background: #FFF2F8;
				margin-right: 5rpx;
			}

			.location {
				width: 110rpx;
				height: 48rpx;
				border-radius: 20rpx;

				background: rgb(235, 245, 255);
			}

			

			.v-p-share {
				padding: 2rpx 2rpx 0 2rpx;

				.v-m-width {
					margin-right: 40rpx;

					.pt_img {
						width: 50rpx;
						height: 50rpx;
						margin-right: -30rpx;
						border-radius: 50%;
					}
				}

				.v-share-friend {
					text {
						color: #294d7d;
						font-size: 24rpx;
						padding-right: 50rpx;
					}

					view {
						color: #ffffff;
						width: 154rpx;
						height: 58rpx;
					}
				}

				.v-share-friend2 {
					text {
						color: #294d7d;
						font-size: 24rpx;
					}
				}
			}

			.editImg {
				width: 20px;
				height: 20px;
				margin-bottom: 8rpx;
			}

			.orderImg {
				width: 192rpx;
				height: 192rpx;
				border-radius: 30rpx;


			}

			.addressImg {
				width: 28.5rpx;
				height: 28.12rpx;
			}
		}

		.PublishTag {
			z-index: 99;
			width: 95%;
			height: 102rpx;
			border-radius: 142rpx;
			color: #fff;
			position: fixed;

			bottom: 20rpx;
			background: rgb(120, 93, 246);
		}

	}
</style>